<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>学生换寝记录</title>
    <!-- Fav  Icon Link -->
    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
    <!-- themify icons CSS -->
    <link rel="stylesheet" th:href="@{/css/themify-icons.css}">
    <!-- Animations CSS -->
    <link rel="stylesheet" th:href="@{/css/animate.css}">
    <!-- Main CSS -->
    <link rel="stylesheet" th:href="@{/css/styles.css}">
    <link rel="stylesheet" th:href="@{/css/green.css}" id="style_theme">
    <link rel="stylesheet" th:href="@{/css/responsive.css}">
    <!-- morris charts -->
    <link rel="stylesheet" th:href="@{/charts/css/morris.css}">
    <!-- jvectormap -->
    <link rel="stylesheet" th:href="@{/css/jquery-jvectormap.css}">
    <link rel="stylesheet" th:href="@{/datatable/dataTables.bootstrap4.min.css}">
    <link rel="stylesheet" th:href="@{/css/layui.css}" media="all">

    <script th:src="@{/js/modernizr.min.js}"></script>
</head>

<body>
<!-- Pre Loader -->
<div class="loading">
    <div class="spinner">
        <div class="double-bounce1"></div>
        <div class="double-bounce2"></div>
    </div>
</div>
<input style="display: none" th:value="${old_id}" id="old_id">

<div class="wrapper">
    <div id="content">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="widget-area-2 lochana-box-shadow">
                        <h3 class="widget-title">学生请假记录 </h3>
                        <div class="table-responsive mb-3">
                            <table id="tableId" class="table table-bordered table-striped">
                                <thead>
                                <tr>
                                    <th class="no-sort">
                                        <div class="custom-control custom-checkbox">
                                            <input class="custom-control-input" type="checkbox" id="select-all">
                                            <label class="custom-control-label" for="select-all"></label>
                                        </div>
                                    </th>
                                    <th>申请时间</th>
                                    <th>批准时间</th>
                                    <th>学号</th>
                                    <th>姓名</th>
                                    <th>联系方式</th>
                                    <th>原楼房号</th>
                                    <th>原寝室号</th>
                                    <th>原床位</th>
                                    <th>新楼房号</th>
                                    <th>新寝室号</th>
                                    <th>新床位</th>
                                    <th>专业</th>
                                    <th>班级</th>
                                    <th>辅导员</th>
                                    <th>原因</th>
                                    <th>同学意见</th>
                                    <th>宿管意见</th>
                                    <th>辅导员意见</th>
                                    <th>结果</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr th:each="ex_dor:${ex_dors}">
                                    <td>
                                        <div class="custom-control custom-checkbox">
                                            <input class="custom-control-input" type="checkbox" th:id="${ex_dor.id}"
                                                   name="id" th:value="${ex_dor.id}">
                                            <label class="custom-control-label" th:for="${ex_dor.id}"></label>
                                        </div>
                                    </td>
                                    <td th:text="${#dates.format(ex_dor.date,'yyyy-MM-dd HH:mm')}"></td>
                                    <td th:text="${#dates.format(ex_dor.approval_date,'yyyy-MM-dd HH:mm')}"></td>
                                    <td th:text="${ex_dor.stu_id}"></td>
                                    <td th:text="${ex_dor.stu_name}"></td>
                                    <td th:text="${ex_dor.stu_tel}"></td>
                                    <td th:text="${ex_dor.old_hou_id}"></td>
                                    <td th:text="${ex_dor.old_dor_id}"></td>
                                    <td th:text="${ex_dor.old_bed_id}"></td>
                                    <td th:text="${ex_dor.new_hou_id}"></td>
                                    <td th:text="${ex_dor.new_dor_id}"></td>
                                    <td th:text="${ex_dor.new_bed_id}"></td>
                                    <td th:text="${ex_dor.stu_study}"></td>
                                    <td th:text="${ex_dor.stu_class}"></td>
                                    <td th:text="${ex_dor.stu_cname}"></td>
                                    <td th:text="${ex_dor.cause}"></td>
                                    <td th:text="${ex_dor.stu_idea}"></td>
                                    <td th:text="${ex_dor.dor_idea}"></td>
                                    <td th:text="${ex_dor.ins_idea}"></td>
                                    <td th:if="${ex_dor.result} eq '同意'" ><font color="green">通过</font></td>
                                    <td th:if="${#strings.isEmpty(ex_dor.result)}" ><font color="blue">审核中</font></td>
                                    <td th:if="${ex_dor.result} eq '拒绝'" ><font color="red">未通过</font></td>
                                </tr>
                                </tbody>
                            </table>

                            <button type="button" class="btn btn-info mt-3 mb-0" onclick="tableToExcel()"><span
                                    class="ti-pencil-alt"></span> 导出
                            </button>
                            <button  type="button" class="btn btn-info mt-3 mb-0" id="pass" th:value="${rank}" onclick="passLeaves()"><span
                                    class="ti-pencil-alt"></span> 同意
                            </button>
                            <button  type="button" class="btn btn-info mt-3 mb-0" id="refuse" th:value="${rank}" onclick="overLeaves()"><span
                                    class="ti-pencil-alt"></span> 拒绝
                            </button>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<!-- Back to Top -->
<a id="back-to-top" href="#" class="back-to-top">
    <span class="ti-angle-up"></span>
</a>


<!-- /Back to Top -->
<!-- Jquery Library-->
<script th:src="@{/js/jquery-3.2.1.min.js}"></script>
<!-- Popper Library-->
<script th:src="@{/js/popper.min.js}"></script>
<!-- Bootstrap Library-->
<script th:src="@{/js/bootstrap.min.js}"></script>
<!-- Datatable  -->
<script th:src="@{/datatable/jquery.dataTables.min.js}"></script>
<script th:src="@{/datatable/dataTables.bootstrap4.min.js}"></script>
<!-- Custom Script-->
<script th:src="@{/js/custom.js}"></script>
<script th:src="@{/js/custom-datatables.js}"></script>


<script th:inline="javascript">
    /*全选*/
    $("#select-all").click(function(){
        // 获得最上面的复选框
        var selectAll = document.getElementById("select-all");
        // 判断这个复选框是否被选中
        var ids = document.getElementsByName("id");
        if(selectAll.checked == true) {
            // 最上面的复选框已被选中
            // 获得下面的所有的复选框，修改checked属性
            for(var i = 0; i < ids.length; i++) {
                ids[i].checked = true;
            }
        } else {
            // 最上面的复选框没有被选中
            // 获得下面的所有的复选框，修改checked属性
            for(var i = 0; i < ids.length; i++) {
                ids[i].checked = false;
            }
        }
    });


    const tableToExcel = () => {
        // 要导出的json数据
        var list = [];
        $("input[name='id']:checked").each(function () {
            if ($(this).is(':checked')) {
                var Date = new Object();
                /*result += $(this).attr('value') + ",";*/
                Date.date = $(this).parent().parent().parent().find("td").eq(1).text();
                Date.approval_date = $(this).parent().parent().parent().find("td").eq(2).text();
                Date.stu_id = $(this).parent().parent().parent().find("td").eq(3).text();
                Date.stu_name = $(this).parent().parent().parent().find("td").eq(4).text();
                Date.stu_tel = $(this).parent().parent().parent().find("td").eq(5).text();
                Date.old_hou_id = $(this).parent().parent().parent().find("td").eq(6).text();
                Date.old_dor_id = $(this).parent().parent().parent().find("td").eq(7).text();
                Date.old_bed_id = $(this).parent().parent().parent().find("td").eq(8).text();
                Date.new_hou_id = $(this).parent().parent().parent().find("td").eq(9).text();
                Date.new_dor_id = $(this).parent().parent().parent().find("td").eq(10).text();
                Date.new_bed_id = $(this).parent().parent().parent().find("td").eq(11).text();
                Date.stu_study = $(this).parent().parent().parent().find("td").eq(12).text();
                Date.stu_class = $(this).parent().parent().parent().find("td").eq(13).text();
                Date.stu_cname = $(this).parent().parent().parent().find("td").eq(14).text();
                Date.cause = $(this).parent().parent().parent().find("td").eq(15).text();
                Date.stu_idea = $(this).parent().parent().parent().find("td").eq(16).text();
                Date.dor_idea = $(this).parent().parent().parent().find("td").eq(17).text();
                Date.ins_idea = $(this).parent().parent().parent().find("td").eq(18).text();
                Date.result = $(this).parent().parent().parent().find("td").eq(19).text();
                list.push(Date);
            }
        });
        // 列标题
        let str = '<tr>' +
            "                                    <th>申请时间</th>\n" +
            "                                    <th>批准时间</th>\n" +
            "                                    <th>学号</th>\n" +
            "                                    <th>姓名</th>\n" +
            "                                    <th>联系方式</th>\n" +
            "                                    <th>原楼房号</th>\n" +
            "                                    <th>原寝室号</th>\n" +
            "                                    <th>原床位</th>\n" +
            "                                    <th>新楼房号</th>\n" +
            "                                    <th>新寝室号</th>\n" +
            "                                    <th>新床位</th>\n" +
            "                                    <th>专业</th>\n" +
            "                                    <th>班级</th>\n" +
            "                                    <th>辅导员</th>\n" +
            "                                    <th>原因</th>\n" +
            "                                    <th>同学意见</th>\n" +
            "                                    <th>宿管意见</th>\n" +
            "                                    <th>辅导员意见</th>\n" +
            "                                    <th>结果</th>"+
            '                                </tr>';
        // 循环遍历，每行加入tr标签，每个单元格加td标签
        if ("" == list) {
            alert("请选择要操作的记录");
            window.location.href = "/ex_dor/showEx_dors";
        }else {
            for (let i = 0; i < list.length; i++) {
                str += '<tr>';
                for (var key in list[i]) {
                    // 增加\t为了不让表格显示科学计数法或者其他格式
                    str += `<td style='mso-number-format:"\\@"'>${list[i][key] + "" + '\t'}</td>`;
                }
                str += '</tr>';
            }
            // Worksheet名
            const worksheet = 'Sheet1';
            const uri = 'data:application/vnd.ms-excel;base64,';

            // 下载的表格模板数据
            const template = `<html xmlns:o="urn:schemas-microsoft-com:office:office"
        xmlns:x="urn:schemas-microsoft-com:office:excel"
        xmlns="http://www.w3.org/TR/REC-html40">
        <head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet>
        <x:Name>${worksheet}</x:Name>
        <x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>
        </x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->
        </head><body><table>${str}</table></body></html>`;
            // 下载模板
            window.location.href = uri + base64(template);
        }
    };

    // 输出base64编码
    const base64 = s => window.btoa(unescape(encodeURIComponent(s)));

    const passLeaves = () => {
        var old_id = document.getElementById("old_id").value;
        var pass = document.getElementById("pass").value;
        var out = "";
        // 要导出的json数据
        var list = [];
        $("input[name='id']:checked").each(function () {
            if ($(this).is(':checked')) {
                var id = $(this).parent().parent().parent().find("td").eq(0).find("div").eq(0).find("input").eq(0).val();
                var stu_id = $(this).parent().parent().parent().find("td").eq(3).text();
                var stu_idea = $(this).parent().parent().parent().find("td").eq(16).text();
                var dor_idea = $(this).parent().parent().parent().find("td").eq(17).text();
                var ins_idea = $(this).parent().parent().parent().find("td").eq(18).text();
                var result = $(this).parent().parent().parent().find("td").eq(19).text();
                //console.log("stu_id:"+stu_id+",old_id:"+old_id+",pass:"+pass+",stu_id:"+stu_id+",stu_idea:"+stu_idea+",dor_idea:"+dor_idea+",ins_idea:"+ins_idea);
                if (stu_id == old_id){
                    out = "无法操作自己提交的申请";
                }else if ("审核中" != result){
                    out = "存在已经完成审核的记录，请重新选择";
                }else if (pass == "学生" && "" != stu_idea){
                    out = "存在操作过的记录，请重新选择";
                }else if (pass == "宿管" && "" != dor_idea){
                    out = "存在操作过的记录，请重新选择";
                }else if (pass == "辅导员" && "" != ins_idea){
                    out = "存在操作过的记录，请重新选择";
                }else if (pass == "宿管" && "" == stu_idea){
                    out = "存在还无法操作的记录，请重新选择";
                }else if (pass == "辅导员" && "" == dor_idea){
                    out = "存在还无法操作的记录，请重新选择";
                }else if (pass == "辅导员" && "" == dor_idea){
                    out = "存在还无法操作的记录，请重新选择";
                }
                list.push(id);
            }
        });
        //console.log("list:"+list);
        if ("" != out){
            alert(out);
            window.location.href = "/ex_dor/showEx_dors";
        }else if ("" == list) {
            alert("请选择要操作的记录");
            window.location.href = "/ex_dor/showEx_dors";
        }else {
                /*console.log(list);*/
                $.ajax({
                    url: '/ex_dor/passEx_dors',
                    async: false,
                    type: 'post',
                    data: {"ids": list.toString()},
                    success: function (data) {
                        console.log(data);
                        alert(data.message);
                        window.location.href = "/ex_dor/showEx_dors";
                    },
                    error: function () {
                        alert("出错,请重试");
                        window.location.href = "/ex_dor/showEx_dors";
                    },
                });
            }
        };
    const overLeaves = () => {
        var refuse = document.getElementById("refuse").value;
        var old_id = document.getElementById("old_id").value;
        var out = "";
        // 要导出的json数据
        var list = [];
        $("input[name='id']:checked").each(function () {
            if ($(this).is(':checked')) {
                var id = $(this).parent().parent().parent().find("td").eq(0).find("div").eq(0).find("input").eq(0).val();
                var stu_id = $(this).parent().parent().parent().find("td").eq(3).text();
                var stu_idea = $(this).parent().parent().parent().find("td").eq(16).text();
                var dor_idea = $(this).parent().parent().parent().find("td").eq(17).text();
                var ins_idea = $(this).parent().parent().parent().find("td").eq(18).text();
                var result = $(this).parent().parent().parent().find("td").eq(19).text();
                console.log("stu_id:"+stu_id+",old_id:"+old_id+",pass:"+refuse+",stu_id:"+stu_id+",stu_idea:"+stu_idea+",dor_idea:"+dor_idea+",ins_idea:"+ins_idea);
                if (stu_id == old_id){
                    out = "无法操作自己提交的申请";
                }else if ("审核中" != result){
                    out = "存在已经完成审核的记录，请重新选择";
                }else if (refuse == "学生" && "" != stu_idea){
                    out = "存在操作过的记录，请重新选择";
                }else if (refuse == "宿管" && "" != dor_idea){
                    out = "存在操作过的记录，请重新选择";
                }else if (refuse == "辅导员" && "" != ins_idea){
                    out = "存在操作过的记录，请重新选择";
                }else if (refuse == "宿管" && "" == stu_idea){
                    out = "存在还无法操作的记录，请重新选择";
                }else if (refuse == "辅导员" && "" == dor_idea){
                    out = "存在还无法操作的记录，请重新选择";
                }
                list.push(id);
            }
        });
        if ("" != out){
            alert(out);
            window.location.href = "/ex_dor/showEx_dors";
        }else if ("" == list) {
            alert("请选择要操作的记录");
            window.location.href = "/ex_dor/showEx_dors";
        }else {
            /*console.log(list);*/
            $.ajax({
                url: '/ex_dor/overEx_dors',
                async: false,
                type: 'post',
                data: {"ids": list.toString()},
                success: function (data) {
                    console.log(data);
                    alert(data.message);
                    window.location.href = "/ex_dor/showEx_dors";
                },
                error: function () {
                    alert("出错,请重试");
                    window.location.href = "/ex_dor/showEx_dors";

                },
            });
        }
    };
</script>


</body>
</html>